/* 这个 css 专门针对博客列表页来设置样式 */
.blog {
    width: 100%;
    padding: 20px;
}

/* 博客标题 */
.blog .title {
    text-align: center;
    color: black;
    font-size: 20px;
    font-weight: 700;

}

/* 博客日期 */
.blog .date {
    text-align: center;
    padding: 10px;
    color: rgb(8, 106, 8);
}

/* 博客的描述 */
.blog .desc {
    text-indent: 2em;
}

/* 查看博客详情按钮 */
.blog .detail {
    /* a 标签是行内元素，要转成块级元素才能进行块级操作 */
    display: block;
    width: 120px;
    height: 40px;
    /* 设置边框 */
    border: 2px solid black;
    text-align: center;
    /* 让文字垂直句中 */
    line-height: 40px;

    text-decoration: none;
    color: black;
    margin: 10px auto;

    /* 加上一个过渡想过 */
    transition: all 0.5s;
}

/* 实现鼠标悬停在按钮上时有一个背景颜色 */
.blog .detail:hover {
    background-color: aquamarine;
    color: black;

}